<template>
	<view>
		<view :style="'padding-top:'+(demo.height+demo.top+10)+'px'">
			<head1 class="nav_top"
				:style="'height:' +  demo.height + 'px;' + 'padding-top:' + demo.top + 'px;padding-bottom:10px'"
				:nav="title">
			</head1>
		</view>
		<view class="server_info" >
			<!-- :style="'background: url('+webImgUrl+banner+')'" -->
			<image :src="webImgUrl+banner" mode="" mode="widthFix"></image>
			<!-- <rich-text :nodes="webImgUrl+banner" space="true"></rich-text> -->
		</view>
		<button class="server_btn" @click="contact">
			<text>立即联系</text>
		</button>
	</view>
</template>

<script>
	import head1 from '../../../common/head/head.vue'
	export default {
		components: {
			head1
		},

		data() {
			return {
				PageCur: "服务",
				title: '',
				webImgUrl: '',
				demo: {
					top: '',
					height: ''
				},
				banner: '',
				jsonId: ''
			}
		},
		onLoad(option) {
			let jsonData = JSON.parse(option.title)
			this.title = jsonData.title
			this.jsonId = jsonData.messageId
			this.getBackground(this.jsonId)
		},

		created() {
			// 获取图片前缀
			this.webImgUrl = this.$webUrl
			const demo = uni.getMenuButtonBoundingClientRect()
			this.demo.top = demo.top
			this.demo.height = demo.height

		},
		methods: {
			getBackground(data) {
				this.$myResquest.getNewsDetail({
					messageId: data
				}).then(res => {
						if (res.data.code == 200) {

							let imgUrl = res.data.data.context
							// let regExp = /(?<=index[\s\t\n]*=[\s\t\n]*)[^\s\t\n|]+/gi;
							// let regExp = new RegExp("(?<=index[\\s\\t\\n]*=[\\s\\t\\n]*)[^\\s\\t\\n|]+", 'gi');
							// const RegEx = /(?<=(img src="))[^"]*?(?=")/gims;
							let haha=imgUrl.match(/[^\'\"]+\.png/ig);
						// ")
						this.banner=haha[0]
					}
				})
		},
		contact() {
			wx.openCustomerServiceChat({
				extInfo: {
					url: 'https://work.weixin.qq.com/kfid/kfc2201d228b8768400'
				},
				corpId: 'ww2e23e1f7cdf7ff4c',
				success(res) {}
			})
		}
	}
	}
</script>

<style lang="scss" scoped>
	.nav_top {
		position: fixed;
		top: 0;
		z-index: 999;
		background: #ffffff;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-width: 750rpx;
	}

	.server_info {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 132rpx;
		left: 0;
		       // background-size: 100% 100%!important;
		image {
			width: 100%;
			height: 100%;
		}
	}

	.server_btn {
		width: 600rpx;
		height: 88rpx;
		/* background: #5cd1ce; */
		border-radius: 44rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		/* margin: 140rpx auto 0px; */
		position: fixed;
		bottom: 216rpx;
		left: 50%;
		transform: translateX(-50%);
		background:#ffffff;


		text {
			font-size: 39rpx;
			font-family: PingFang SC, PingFang SC-Medium;
			font-weight: 500;
			color: #49B3AF;
		}
	}
</style>
